<template>
  <Pad>
    <div class="notice-detail" v-if="notice">
      <div class="topic">
        <span class="title">{{ notice.messageTypeName }}</span>
        <span class="date">{{ notice.receiveTime }}</span>
      </div>
      <div class="content">{{ notice.content }}</div>
    </div>
  </Pad>
</template>

<script>
import Pad from "@/components/pad";
import { noticeInfo } from "@/api/notice";
export default {
  data() {
    return {
      notice: undefined
    };
  },
  components: {
    Pad
  },
  created() {
    console.log(this.$route);
    noticeInfo({ id: this.$route.params.id }).then(({ data }) => {
        this.notice = data;
    });
  },
  methods: {}
};
</script>

<style lang='scss'>
.notice-detail {
  padding: 0.373333rem /* 28/75 */;
  border-radius: 0.213333rem /* 16/75 */;
  background-color: #fff;
  margin-bottom: 0.266667rem /* 20/75 */;
  .topic {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.266667rem /* 20/75 */;
    .title {
      color: #333333;
      font-size: 0.32rem /* 24/75 */;
    }
    .date {
      color: #cccccc;
      font-size: 0.266667rem /* 20/75 */;
    }
  }
  .content {
    color: #cccccc;
    font-size: 0.266667rem /* 20/75 */;
  }
}
</style>
